<template>
	<view class="trace-list">
		<view class="user">
			<view class="avatar">
				<button open-type="chooseAvatar" @chooseavatar="setAvatar">
					<image :src="user.avatar" />
				</button>
			</view>
			<view class="info">
				<view class="name">
					<text>{{user.name}}</text>
					<text class="edit" @tap="setName">设置</text>
				</view>
				<view class="tools">
					<button @tap="toTrack('')"><icon class="iconfont icon-footprint-full"></icon>足迹</button>
					<button @tap="handleIDQR('scan')"><icon class="iconfont icon-tianjiajiahaoyoutianjiapengyou"></icon>朋友</button>
					<button @tap="handleIDQR('show')"><icon class="iconfont icon-erweima1"></icon>身份码</button>
				</view>
			</view>
		</view>
		<view class="buddy">
			<scroll-view scroll-y >
				<view class="b-tip" v-if="isNull(buddyList)">
					<text>你还没有添加过朋友</text>
					<view class="b-tip-view" style="margin-top: 25px;">
						<text>点击</text>
						<button class="b-tip-btn" @tap="handleIDQR('scan')">
							<icon class="iconfont icon-tianjiajiahaoyoutianjiapengyou"></icon>朋友
						</button>
						<text>按钮</text>
					</view>
					<view class="b-tip-view">
						<text>扫描朋友的</text>
						<button class="b-tip-btn" @tap="handleIDQR('show')">
							<icon class="iconfont icon-erweima1"></icon>身份码
						</button>
					</view>
					<text>即可完成添加</text>
				</view>
				<uni-swipe-action >
					<uni-swipe-action-item v-for="item in buddyList" :key="item.id">
						<view class="swipe-action-item">
							<view class="avatar">
								<image :src="item.buddyAvatar" />
							</view>
							<view class="info">
								<text>{{item.buddyName}}</text>
								<button type="primary" size="mini" class="btn" @tap="toTrack(item.buddyOpenId)">
									<icon class="iconfont icon-footprint-full"></icon>
									查看足迹
								</button>
							</view>
						</view>
						<template v-slot:left>
							<view class="swipe-action-btn">
								<view class="del" @tap="delBuddy(item.buddyOpenId,item.buddyName)">
									<text>删除朋友</text>
								</view>
							</view>
						</template>
					</uni-swipe-action-item>
				</uni-swipe-action>
			</scroll-view>
		</view>
		<!-- 身份二维码 -->
		<uni-popup ref="POP_UP_QR" :maskClick="true" @tap="handleIDQR('close')">
			<id-card v-if="qrShow" @tap.stop="" @refreshIDQOR="handleIDQR"></id-card>
		</uni-popup>
	</view>
</template>

<script>
import { onMounted, reactive, ref } from "vue"
import request from "../../util/request.js"
import util from "../../util/util.js"
import userInfo from "../../hooks/userInfo.js"
import useBuddyList from "../../hooks/useBuddyList.js"
import useWxImg from "../../hooks/useWxImg.js"
import IdCard from "../../components/fun_coms/idcard.vue"
	export default {
		components:{
			IdCard
		},
		setup() {
			onMounted(()=>{
				init()
			})
			
			// 页面初始化
			function init() {
				uni.setNavigationBarColor({
					frontColor: '#000000',
					backgroundColor:'#ffd303',
				})
				uni.setNavigationBarTitle({
					title: '足迹你我Ta'
				})
				if (util.isNull(buddyList.value)) getBuddyList()
			}
			let user = userInfo()
			// 设置头像
			async function setAvatar(e) {
				// console.log(e)
				let p = {}
				p.openId = user.openId
				p.avatar = await useWxImg(e.detail.avatarUrl)
				if (typeof(p.avatar) == 'string') {
					let r = await request.setUser(p)
					if (r.code == 10000 ) {
						user.avatar = p.avatar
					}
				} else {
					let _title = '图片转换错误：' + p.avatar.errMsg
					uni.showToast({
						title: _title,
						icon: 'none',
						duration: 2500
					})
				}
			}
			// 设置昵称
			function setName() {
				uni.showModal({
					title: '设置昵称',
					content: user.name,
					editable:true,
					placeholderText: '请输入你的昵称',
					success: async function (res) {
						if (res.confirm) {
							let p = {}
							p.openId = user.openId
							p.name = res.content
							let r = await request.setUser(p)
							if (r.code == 10000 ) {
								user.name = p.name
							}
						}
					}
				})
			}
			// 获取好友列表
			let buddyList = useBuddyList()
			async function getBuddyList() {
				let data = {}
				data.openId = user.openId
				let r = await request.getBuddys(data)
				if (r.code == 10000) {
					let _data = r.data
					for (let i in _data) {
						_data[i].buddyAvatar = _data[i].buddyAvatar || '/static/imgs/nouser.png'
					}
					buddyList.value = r.data
				}
			}
			// 操作身份码
			let POP_UP_QR = ref(null)
			let qrShow = ref(false)
			function handleIDQR(f) {
				if (f == 'show') {
					qrShow.value = true
					POP_UP_QR.value.open('top')
				} else if (f.indexOf('close') >= 0) {
					if (f == 'close-refresh') getBuddyList()
					qrShow.value = false
					POP_UP_QR.value.close()
				}
				else if (f == 'scan') {
					uni.scanCode({
						success: async(r) => {
							let p = {}
							p.openId = user.openId
							p.buddyId = r.result
							let r0 = await request.setBuddy(p)
							if (r0.code == 10000) {
								let buddy = {}
								buddy.buddyOpenId = r0.data[0].openId
								buddy.buddyName = r0.data[0].name
								buddy.buddyAvatar = r0.data[0].avatar
								buddyList.value.unshift(buddy)
							}
						},
						fail: (e) => {
							console.log(e)
						}
					})
				}
			}
			// 删除好友
			function delBuddy(oid,name) {
				uni.showModal({
					title: '是否确认删除'+name,
					content: '删除后不可恢复',
					confirmText: '删除',
					confirmColor: 'rgb(245,108,108)',
					success: async function (res) {
						if (res.confirm) {
							let p = {}
							p.openId = user.openId
							p.buddyOId = oid
							let r = await request.delBuddy(p)
							if (r.code == 10000) {								
								let b = buddyList.value
								for(let i in b) {
									if (b[i].buddyOpenId == oid) {
										b.splice(i,1)
									}
								}
								buddyList.value = b
							}
						}
					}
				})
			}
			
			// 查看足迹
			async function toTrack(oId) {
				let _url = '/pages/track/track'
				let b = buddyList.value
				for(let i in b) {
					if (oId == b[i].buddyOpenId) {
						_url = `${_url}?id=${oId}&name=${b[i].buddyName}`
					}
				}
				let g = {}
				g.openId = oId || user.openId
				let r = await request.getMarksDate(g)
				if (r.code == 10000) {
					let _mdata = r.data
					if (util.isNull(_mdata)) {
						uni.showToast({
							title: '这个朋友还没有产生足迹',
							icon: 'none',
						})
					} else {
						let _markDateArr = []
						for (let i in _mdata) {
							_markDateArr.push(util.dateFormatStr(_mdata[i].markDate))
						}
						uni.setStorageSync('markDateArr',_markDateArr)
						uni.navigateTo({
							url: _url
						})
					}
				}
			}
			
			function isNull(v) {
				return util.isNull(v)
			}
			
			return {
				user,buddyList,setAvatar,setName,POP_UP_QR,handleIDQR,qrShow,delBuddy,toTrack,isNull
			}
		}
	}
</script>

<style lang="scss" src="./buddy.scss"></style>